<template>
	<view class="metiezi">
		<!-- //弹出层 -->
		<u-modal :show="show" :title="title" confirmColor="#2ACC9C"  :showCancelButton='true'
			@confirm="jsconfirm" @cancel="show=false"></u-modal>
		<u-modal :show="cxshow" :title="cxtitle" confirmColor="#2ACC9C"  :showCancelButton='true'
			@confirm="cxconfirm" @cancel="cxshow=false"></u-modal>
		<view class="flexcenter shadow margin_top mainpadding">
			<!-- tabs分页 -->
			<u-tabs :list="tags" lineColor="#2ACC9C" :current="current" lineWidth='30' :activeStyle="{
		    color: '#333333',
		    fontWeight: 'bold',
		    transform: 'scale(1.05)'
		}" :inactiveStyle="{
		            color: '#999999',
					 fontWeight: 'bold',
		            transform: 'scale(1)'
		        }" itemStyle="padding-left: 30px; padding-right: 30px; height: 34px;" @click="clicktab"></u-tabs>
		</view>
		<!-- 待审核 -->
		<view class="mainpadding2">
			<view class="flexcenter placeimage" v-show="!list.total">
				<image src="../../static/image/system/zwtz.png" mode=""></image>
			</view>
			<view class="ffffff shadow radius mainpadding margin_top" @click="shijixq(item.id)" v-for="item in list.data" :key="item.id">
				<view class="flexbetween ">
					<view class="strongtext">{{item.username}}</view>
					<view class="smalltext">{{item.createtime | formatDate('-')}}</view>
				</view>
				<view class="huisetext margin_top2">
					{{item.name}}
				</view>
				<view class="flexbetween">
					<view class="lvsebtn allbtn" v-show="item.topic_id==1">#闲置</view>
					<view class="zisebtn allbtn" v-show="item.topic_id==2">#打听</view>
					<view class="hongsebtn allbtn" v-show="item.topic_id==3">#恋爱</view>
					<view class="chengsebtn allbtn" v-show="item.topic_id==4">#趣事</view>
					<view class="huangsebtn allbtn" v-show="item.topic_id==5">#招聘</view>
					<view class="flexright">
						<view class="huangsetext" v-show="item.check_status==1">审核中！</view>
						<view class="lvsetext" v-show="item.check_status==2">上线中</view>
						<view class="huangsetext" v-show="item.check_status==4">已结束</view>
						<view class="hsetextbtn" @click.stop="jieshu(item.id)" v-show="item.check_status==2">结束上线</view>
						<view class="lvsetextbtn" @click.stop="chongxinsx(item.id)" v-show="item.check_status==4">重新上线</view>
						<view v-if="item.check_status==2">
							<view class="lansetextbtn" v-show="item.is_refresh==1" @click.stop="sxzdbtn(item.id)">刷新置顶</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				cxtitle: '是否重新上线',
				title: '是否结束上架？',
				show: false,
				cxshow: false,
				current: 0,
				tags: [{
					name: '待审核',
				}, {
					name: '上线中',
				}, {
					name: '已结束'
				}, {
					name: '全部'
				}, ],
				page: 1,
				limit: 12,
				list: {
					data: []
				},
				listid:0,
				state:0
			}
		},
		onLoad(options) {
			this.current = options.msg
			this.myjishi()
		},
		filters: {
			// 时间戳处理
			formatDate: function(value, spe = '/') {
				let maohao=':'
				value = value * 1000
				let data = new Date(value);
				let year = data.getFullYear();
				let month = data.getMonth() + 1;
				let day = data.getDate();
				let h = data.getHours();
				let mm = data.getMinutes();
				let s = data.getSeconds();
				month = month >= 10 ? month : "0" + month;
				day = day >= 10 ? day : "0" + day;
				h = h >= 10 ? h : "0" + h;
				mm = mm >= 10 ? mm : "0" + mm;
				s = s >= 10 ? s : "0" + s;
				return `${month}${spe}${day}  ${h}${maohao}${mm}`;
			}
		},
		methods: {
			// 我的集市
			myjishi(isPage, page){
				let state = 0
				let current = this.current
				let _this = this;
				if(current==0){
					state = 1
				}else if(current==1){
					state = 2
				}else if(current==2){
					state = 4
				}else{
					state = 0
				}
				httpRequest.request('user/forum_lists', 'POST', {
					page: page || 1,
					limit: _this.limit,
					state:state
				}, false, false, true).then(res => {
					if (res.code == 1) {
						let resList = res.data;
						let dataList = _this.list;
						if (isPage == true) {
							_this.list.data = dataList.data.concat(resList.data);
						} else {
							_this.list = resList
							_this.list.data = resList.data;
						}
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			onReachBottom() {
				let _this = this;
				let list = _this.list;
				let page = _this.page;
				if (list.last_page <= page) {
					return false;
				}
				page++;
				_this.page = page;
				_this.myjishi(true, page);
			},
			shijixq(id) {
				let msg = {
					detailid:id,//列表id
					plid:""//评论id
				}
				uni.navigateTo({
					url: '/pages/jishi/xiangqingsj?idjpp='+encodeURIComponent(JSON.stringify(msg))
				})
			},
			// 结束
			jieshu(id) {
				this.listid = id
				this.show = true;
			},
			jsconfirm(){
				httpRequest.request('user/multi_status', 'POST', {
					state:4,
					forum_id:this.listid
				}, false, false, true).then(res => {
					httpRequest.toast(res.msg)
					this.myjishi()
				})
				this.show = false;
			},
			//重新上线
			chongxinsx(id) {
				this.listid = id
				this.cxshow = true;
			},
			cxconfirm(){
				httpRequest.request('user/multi_status', 'POST', {
					state:2,
					forum_id:this.listid
				}, false, false, true).then(res => {
					httpRequest.toast(res.msg)
					this.myjishi()
				})
				this.cxshow = false;
			},
			// 刷新置顶
			sxzdbtn(id){
				httpRequest.request('user/refresh', 'POST', {
					forum_id:id
				}, false, false, true).then(res => {
					httpRequest.toast(res.msg)
				})
			},
			clicktab(e) {
				this.current = e.index
				this.myjishi()
			},
		}
	}
</script>
<style lang="scss" scoped>

</style>
<style lang="scss" scoped>
	.lvsetextbtn{
		margin-left: 30rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24rpx;
		font-family: Microsoft YaHei;
		font-weight: bold;
		color: #FFFFFF;
		width: 142rpx;
		height: 65rpx;
		background:  #2ACC9C;
		border-radius: 20rpx;
	}
	.lansetextbtn{
		margin-left: 30rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24rpx;
		font-family: Microsoft YaHei;
		font-weight: bold;
		color: #0096FF;
		width: 140rpx;
		height: 63rpx;
		border: 1rpx solid #0096FF;
		border-radius: 20rpx;
	}
	.hsetextbtn {
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24rpx;
		font-family: Microsoft YaHei;
		font-weight: bold;
		color: #FFFFFF;
		width: 142rpx;
		height: 65rpx;
		background: #FF7800;
		border-radius: 20rpx;
		margin-left: 30rpx;
	}

	.lvsetext {
		font-size: 24rpx;
		font-family: Microsoft YaHei;
		font-weight: bold;
		color: #2ACC9C;
		margin-left: 30rpx;
	}

	.huangsetext {
		font-size: 24rpx;
		font-family: Microsoft YaHei;
		font-weight: bold;
		color: #FF7800;
		margin-left: 30rpx;
	}

	.zisebtn {
		color: #5179FA;
		background: rgba(81, 121, 250, .1);
	}

	.lvsebtn {
		color: #2ACC9C;
		background: rgba(0, 232, 190, .1);
	}
	.chengsebtn {
		color: #FEB57F;
		background: rgba(254, 181, 127, .1);
	}
	
	.hongsebtn {
		background: rgba(253, 121, 112, .1);
		color: #FD7970;
	}
	
	.huangsebtn {
		background: rgba(253, 209, 130, .1);
		color: #FDD182;
	}

	.allbtn {
		margin-top: 18rpx;
		width: 77rpx;
		height: 36rpx;
		font-size: 20rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		border-radius: 18rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.margin_top2{
		margin-top: 20rpx;
	}

	.huisetext {
		font-size: 24rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: #999999;
		text-overflow: -o-ellipsis-lastline;
		overflow: hidden; //溢出内容隐藏
		text-overflow: ellipsis; //文本溢出部分用省略号表示
		display: -webkit-box; //特别显示模式
		-webkit-line-clamp: 2; //行数
		line-clamp: 2;
		-webkit-box-orient: vertical; //盒子中内容竖直排列
	}
</style>
